<template>
  <div id="Delivery">
    <vj-list :load-more="loadMore.bind(this)">
      <template #default="{item:{businessName,postName,salary,businessAddress,status}}">
        <ul class="c-job">
          <li class="c-job__title">{{ postName }}</li>
          <li>{{ businessName }}</li>
          <li>{{ businessAddress }}</li>
          <li class="c-job__num">{{ salary }}</li>
          <li class="c-job__status">{{ getStatus(status) }}</li>
        </ul>
      </template>
    </vj-list>
  </div>
</template>
<script lang="ts">
import Vue, {ComponentOptions, VueConstructor} from "vue"
import Component from 'vue-class-component'
import VjList from "@/components/vj-list.vue";
import {requestByGet} from "@/utils/request";

let i = 5;
@Component({
  components: {VjList}
})
export default class Delivery extends Vue implements ComponentOptions<Vue> {
  name = "Delivery";

  async loadMore(pageNo, pageSize) {
    const {records} = await requestByGet(`/qqc/qqcApplyposts/userList`, {QqcApplyposts:sessionStorage.getItem("phone")});
    return records;
  }

  getStatus(status) {
    return ["已申请","查看", "拒绝", "邀约"][+status-1]
  }
}
</script>

<style scoped lang="scss">
@import "~assets/common.scss";

#Delivery {
  .c-job {
    font-size: 12px;
    line-height: 1.5;
    position: relative;
    &__title {
      font-size: 17px;
      color: #181818;
      font-weight: 600;
    }

    &__num {
      font-size: 14px;
      color: #349e7e;
    }
    &__status{
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 30px;
    }
  }

}
</style>
